<template>
  <TitleCard :title="titleCardApply" :showMore="showMore">
    <template slot="rightOperation">
      <div class="btn-wrap">
        <a-button class="btn-item" @click="uploadRport">新增上传</a-button>
      </div>
    </template>
    <div class="backStack-table-wrap backStack-transferEamil">
      <Table
        ref="table"
        :options="fields"
        :tableValue="tableValue"
        :customSlotOpt="slotOpt"
        :otherOpt="customOtherOpt"
        :rowSelection="null"
        @change="initTableValue"
        @actionClick="handlerActionClick"
      ></Table>
    </div>
    <AModal ref="modal" :customOpt="customModalOpt" @ok="handlerOk"></AModal>
    <AddReport
      v-if="isShowAdd"
      @cancel="cancel"
      @addSuccess="addSuccess"
    ></AddReport>
  </TitleCard>
</template>

<script>
import Table from '../../components/table/index.vue'
import AModal from '../../components/AModal'
import AddReport from './components/addReport.vue'
import mixinsBackStack from '@/views/backstageSupport/mixins'
import { fields, slotOpt } from './configs/configs'
import { getNavBrandList, deleteNavBrand } from '@/api/dataNavigation.js'

export default {
  mixins: [mixinsBackStack],
  data() {
    return {
      slotOpt,
      fields,
      titleCardApply: '已上传业务窗口申请表',
      customOtherOpt: {
        pagination: {
          total: 0,
          pageNum: 1,
          pageSize: 10
        }
      },
      tableValue: [],
      defaultSearchParam: {},
      isShowAdd: false
    }
  },
  components: {
    Table,
    AModal,
    AddReport
  },
  mounted() {
    this.initSearchParams() // 重置搜索的参数
    this.initTableValue()
  },
  methods: {
    async initTableValue() {
      try {
        this.loadingTable(true) // 开启表格的加载动画
        const params = this.handlerBeforeRequestParams()
        const { rows, total } = await getNavBrandList(params) // 请求表格数据接口
        const row = this.handlerDateFormat(rows) // 处理时间格式
        this.handlerResultMappings(rows) // 处理数据的映射关系
        this.tableValue = row
        this.customOtherOpt.pagination.total = total
        this.initSelectedRowIds() // 清空勾选的选项
      } catch (error) {
        this.$apiStatusHandler(99, error.msg) // 请求异常，则全局轻提示
      } finally {
        this.loadingTable(false)
      }
    },
    // 请求前的参数收集
    handlerBeforeRequestParams() {
      const { pagination } = this.$refs.table
      const { pageSize, pageNum } = pagination
      const params = {
        ...this.searchParam,
        pageNum,
        pageSize,
        category: '2'
      }
      return params
    },
    down(row) {
      const a = document.createElement('a')
      a.href = row.file.filePath
      a.download = row.file.fileName
      a.click()
    },
    cancel() {
      this.isShowAdd = false
    },
    addSuccess() {
      this.isShowAdd = false
      this.initTableValue()
    },
    uploadRport() {
      this.isShowAdd = true
    },
    // 单独删除
    singleDelete(row) {
      this.customModalOpt.contentTips = '是否确定删除该报告'
      this.beforeShowModal(true, {
        source: 'dealDeleteApi',
        params: { ids: row.id }
      })
    },
    async dealDeleteApi(params) {
      const { ids } = params
      try {
        const { msg, code } = await deleteNavBrand(ids)
        this.initTableValue()
        this.$apiStatusHandler(code, msg)
      } catch (error) {
        this.$apiStatusHandler(99, error.msg)
      }
    },
  }
}
</script>
